{extend name='public/base'}
{block name='content'}

<!-- <style type="text/css">
   
</style> -->

    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        {$item['item1']}
        <small>{$item['item2']}</small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> {$item['item1']}</a></li>
        <li class="active">{$item['item2']}</li>
      </ol>
    </section>

    <!-- Main content -->
    <section class="content">
    
        <blockquote class="layui-elem-quote layui-text clw">
            <form class="form-horizontal layui-form" action="{:url('admin/chart/count')}" method="get">
              <div class="box-body" style="padding: 15px;">
                  <div>
                      <div class="col-sm-2">
                          <select name="settled_id" id="settled_id" lay-filter="settled_id" >
                              <option value="">所有诊所</option>
                          </select>
                      </div>

                      <div class="col-sm-2">
                          <select name="drug_type" id="drug_type" >
                            <option value="">状态</option>
                            <option value="0">中药</option>
                            <option value="1">西成药</option>
                            <option value="2">收费项目</option>
                          </select>
                      </div>
  
                      <div class="col-sm-1">
                          <button type="submit" class="layui-btn layui-btn-sm layui-btn-warm">搜索</button>
                      </div>
                      <div class="col-sm-1">
                          <button onclick="javascript:location.reload()" class="layui-btn layui-btn-sm layui-btn-warm">刷新</button>
                      </div>
                  </div>
              </div>
            </form>
        </blockquote>   
        
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">统计</h3>
            </div>

            <div class="row" style="margin-bottom: 30px">

                <div class="layui-tab layui-tab-card tjdiv col-md-3" style="margin-left: 30px">
                    <div class="layui-tab-content hdiv">
                        <div class="layui-tab-item layui-show">
                         药物种类(单位：种数)
                      </div>
                      <div class="layui-tab-item layui-show jehh">
                         <text style="font-size: 42px;color: brown">{$alldrug}</text>
                      </div>
                  </div>
                </div>
    
            </div>

        </div>

        <i style="clear: both;"></i>
        <div class="row" id="main" style="height:500px;background: #ffffff"></div>
        <i style="clear: both;"></i>

      <!-- /.row -->
    </section>
    <!-- /.content -->

{/block}


{block name='script'}
<script>

    //新增用户的模态框数据清除
    $("#addModal,#editModal").on('hide.bs.modal',function(){
        $('#addReset').click();
    });
    //加载缓冲动画
    $("#addModal,#editModal").on('show.bs.modal',function(){
         layer.closeAll();
    });

    //搜索显示所有诊所
    settlled('settled_id');

    // 获取小区列表
    function settlled(obj,id = 0) {
        $.ajax({
          type: 'POST',
          url: 'settlled',
          dataType:  'json',
          success: function(ret){
            console.log("诊所",ret);
            if(ret.code == 200){
              var h = '<option value="" >请选择诊所</option>';
                $.each(ret['data'], function(k,v) {
                  h += '<option value="'+v['id']+'">'+v['clinic']+'</option>'
                });
                $('#'+obj).html(h);
                // form.render();
            }else{
              layer.msg(ret.msg,{icon: 5,time:2000});
            }
          },error: function (err) {
                var err_msg = err.responseText
                if(err_msg.status_code=401);
                layer.msg("对不起,您没有该权限!");

          }
        }); 
    }

</script>

<script type="text/javascript">
  // 基于准备好的dom，初始化echarts实例
  var myChart = echarts.init(document.getElementById('main'),'wonderland');

  // 指定图表的配置项和数据
  var option = {
      title: {
          text: '药物种类统计'
      },
      tooltip: {},
      legend: {
           data:['种类']
      },
      xAxis: {
          data: ["中药","西药","收费项目"]
      },
      yAxis: {},
      series: [{
          name: '种数',
          type: 'bar',
          data: [{$drugcount}]
      }]

  };

  // 使用刚指定的配置项和数据显示图表。
  myChart.setOption(option);

</script>
{/block}